<template>
  <el-card>
    <div class="header">
    
    </div>

    <el-table :data="noticeList" border style="width: 100%" v-loading="loading">
      <el-table-column prop="id" label="ID" width="80" />
      <el-table-column prop="title" label="标题" />
      <el-table-column prop="detaile" label="内容" />
      <el-table-column prop="status" label="状态" align="center">
        <template #default="{ row }">
          <el-tag :type="row.status === 'active' ? 'success' : 'info'">
            {{ row.status === 'active' ? '启用' : '停用' }}
          </el-tag>
        </template>
      </el-table-column>
    </el-table>
  </el-card>
</template>


<script setup>
import { useAnnouncement } from '@/hooks/student/useAnnouncement'
import { onMounted } from 'vue';

const {
  loading,
  noticeList,
  dialogVisible,
  form,
} = useAnnouncement();


</script>


<style scoped>
.header {
  margin-bottom: 16px;
  display: flex;
  justify-content: space-between;
}
</style>